import BannerPng from "@/assets/images/banner2.png";
import { post } from "@/request";
import { useEffect, useState } from "react";

export default function Help() {
  const [info, setInfo] = useState<any[]>([]);

  const getInfo = () => {
    post("/function/getHelpDirectoryTree", { params: {} }).then((res: any) => {
      console.log(res);
      setInfo(res.msg);
    });
  };

  useEffect(() => {
    getInfo();
  }, []);
  return (
    <div>
      <img src={BannerPng} style={{ width: "100%" }} alt="" />
      <div
        style={{ maxWidth: "1200px", margin: "20px auto", background: "#fff", padding: "20px" }}
        className="ql-editor"
      >
        <div dangerouslySetInnerHTML={{ __html: info }}></div>
        {/* {info.map((item) => (
          <div key={item.id}>
            {item?.helpTitle?.length > 1 ? (
              <div style={{ fontWeight: "700", fontSize: "28px" }}>{item.helpTitle}</div>
            ) : null}
            <div dangerouslySetInnerHTML={{ __html: item.helpDescribed }}></div>
            {Boolean(item.children.length) &&
              item.children.map((item1: any) => (
                <div key={item1.id} style={{ paddingLeft: "40px" }}>
                  <div style={{ fontSize: "26px", fontWeight: "700", margin: "20px 0 10px 0" }}>{item1.helpTitle}</div>
                  <div>
                    <div dangerouslySetInnerHTML={{ __html: item1.helpDescribed }}></div>
                  </div>
                </div>
              ))}
          </div>
        ))} */}
      </div>
    </div>
  );
}
